import Sact from "sact";

let template = `
<div class="chatContent" :class="props.me ? 'chatRight' : 'chatLeft'">
<img s-if="!props.me" :src="userInfor[props.message.from].avatar_img_url" class="chatAvatar" style="margin-top:12px" >
<div class="chatContentRight" :style="{'align-items':props.me ? 'flex-end' : 'flex-start'}">
<div class="chatTagName" :style="{'margin-right':props.me ? '8px' : '0'}">
    {{userInfor[props.message.from].username}}
</div>
<div :class="props.me ? 'chatMyText' : 'chatTargetText'">
    {{props.message._lctext||props.message.content}}
    <div class="chatTagName" :class="props.me ? 'chatTimeLeftTag' : 'chatTimeRightTag'">{{props.message._time}}</div>
</div>
</div>
<img s-if="props.me" :src="userInfor[props.message.from].avatar_img_url" class="chatAvatar" alt="" style="margin-top:12px">
</div>
`
export default Sact.component({
    template,
    name: "message",
    props:['me','message'],
    shouldUpdate(o, n) {
        return o.message.id !== n.message.id;
    },
})